<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>醋醋商城</title>
    <!--引用css样式-->
    <link rel="shortcut icon" href="favicon.ico">
    <!--<link type="text/css" rel="stylesheet" href="/static/css/bootstrap.css">-->
    <link type="text/css" rel="stylesheet" href="/static/css/basic.css">
    <link type="text/css" rel="stylesheet" href="/static/css/bootstrap.css">
</head>

<style>
    #Top {
        margin-bottom: 120px;
    }
</style>
<body>
<!--Top开始-->
<div id="Top">
    <div class="banner"><a href="/index"><img src="/static/images/logo.png"/></a></div>
    <!--search begin-->
</div>
<!--Top结束-->

<div class="container">

    <div class="panel panel-default">
        <div class="panel-heading">添加商品信息</div>
        <div class="panel-body">

            <div class="alert alert-danger" role="alert" th:if="${#httpServletRequest.getAttribute('error')}">
                <span th:text="${#httpServletRequest.getAttribute('error')}">

                </span>
            </div>

            <div class="alert alert-success" role="alert" th:if="${#httpServletRequest.getAttribute('success')}">
                <span th:text="${#httpServletRequest.getAttribute('success')}">

                </span>
            </div>


            <form class="form-horizontal" action="/product/add" id="addProduct" method="post">
                <div class="form-group">
                    <label class="col-sm-2 control-label">商品名字</label>

                    <div class="col-sm-10">
                        <input type="text" name="name" class="form-control" th:value="${#httpServletRequest.getAttribute('product').name == null ?'': #httpServletRequest.getAttribute('product').name}">
                    </div>
                </div>
                <div class="hr-line-dashed"></div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">商品描述</label>

                    <div class="col-sm-10">
                        <input type="text" name="detail" class="form-control" th:value="${#httpServletRequest.getAttribute('product').detail == null ?'': #httpServletRequest.getAttribute('product').detail}">
                    </div>
                </div>
                <div class="hr-line-dashed"></div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">商品价格</label>

                    <div class="col-sm-10">
                        <input type="text" name="price" class="form-control" th:value="${#httpServletRequest.getAttribute('product').price == null ?'': #httpServletRequest.getAttribute('product').price}">
                    </div>
                </div>
                <div class="hr-line-dashed"></div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">商品库存</label>

                    <div class="col-sm-10">
                        <input type="text" name="stock" class="form-control"  th:value="${#httpServletRequest.getAttribute('product').stock == null ?'': #httpServletRequest.getAttribute('product').stock}">
                    </div>
                </div>
                <div class="hr-line-dashed"></div>

            </form>

            <div class="col-sm-4 col-sm-offset-2">
                <button class="btn btn-primary" id="save_product" type="submit">保存内容</button>
                <button class="btn btn-white" id="cancle_product" type="button">取消</button>
            </div>
        </div>
    </div>

</div>

</body>
<script src="/static/js/jquery.js"></script>
<script src="http://cdn.staticfile.org/webuploader/0.1.0/webuploader.html5only.min.js"></script>
<script>
    $(function () {
        var sumitBtn = $('#save_product');
        sumitBtn.click(function () {
            var name = $('input[name="name"]').val();

            if (name === '') {
                alert("商品名称必须填写！")
                return
            }

            var detail = $('input[name="detail"]').val();

            if (detail === '') {
                alert("商品描述必须填写！")
                return
            }
            var price = $('input[name="price"]').val();

            if (price === '') {
                alert("商品价格必须填写！")
                return
            }

            if (Math.round(price) != price) {
                alert("商品价格必须为整数")
                return
            }

            var stock = $('input[name="stock"]').val();

            if (stock === '') {
                alert("商品库存必须填写！")
                return
            }

            if (Math.round(stock) != stock) {
                alert("商品库存必须为整数")
                return
            }

            $('#addProduct').submit();
        });
        var cancelBtn = $('#cancle_product');
        cancelBtn.click(function () {
            window.location.href = urls.product_html.product_url
        })

    })
</script>

<script>
    $(function () {
        var uploader = WebUploader.create({

            // swf文件路径
            swf: BASE_URL + '/js/Uploader.swf',

            // 文件接收服务端。
            server: 'http://webuploader.duapp.com/server/fileupload.php',

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: '#picker',

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            resize: false
        });
    })
</script>
</html>